
import React,{ Component } from 'react';
import './index.css';
import { DaoContainer } from './daoContainer';
import { connect } from 'react-redux';


class DaoDemo2 extends Component{
  state = { 
    scrollLeft: 0
  }


  onScrollHandle = () => { // 监听并更新 该div的水平滚动距离
    const scrollLeft = this.scrollRef.scrollLeft;
    this.setState({
      scrollLeft     
    })
  }
    
  render() { 
    //console.log("数据处理绘制入口页curvesCount",this.props.curvesCount);
    return (
      <div>
          <div 
            className="data-content-wrapper"
            onScrollCapture={() => this.onScrollHandle()}   // 监听该div的水平滚动距离
            ref={c => {
              this.scrollRef = c;
            }}
          >    {/* style={{minWidth: 1100}} */}
            <DaoContainer 
              daosList={this.props.daosDataList2} 
              isFixed={this.props.isFixed} 
              scrollLeft={this.props.scrollLeft} /> 
          </div>     
      </div>  
    )
  }
} 


export default connect(
  state => ({curvesCount: state.curvesCount,
    updatePages: state.updatePages,
    daosDataList2: state.daosDataList2}),  //  daosDataList: state.daosDataList获取 数据处理页面列表，没有传入曲线数据前，获取的是 道列表，也就是默认模板
  {}      
)(DaoDemo2);
